import React from "react"

import { SFormItem } from "@/components/common"
import StyleSelect from "@/components/common/styleSelect"
import { useLocale, useOptions } from "@/hooks"

const TimesTypeSelect = ({ rules, disable, labelProps, selectorProps, name, isLabel = true }: any) => {
	const { formatMessage } = useLocale()

	const options = useOptions({
		modal: "timesTypeArr",
		func: formatMessage
	})

	const defaultValue = options.length > 0 ? options[0].value : undefined

	return (
		<SFormItem
			initialValue={defaultValue}
			name={name || "timesType"}
			rules={rules}
			{...labelProps}
			label={isLabel ? formatMessage({ id: "member.times_type" }) : undefined}
		>
			<StyleSelect
				w={250}
				defaultValue={defaultValue}
				placeholder={formatMessage({ id: "common.select_all" })}
				allowClear
				options={options}
				disable={disable}
				{...selectorProps}
			/>
		</SFormItem>
	)
}

export default TimesTypeSelect
